//chatgpt: vue cdn 方式引入 elementui 的查询做成一个js组件，供其他页面引用这个js组件的示例

//直接引入（test.html） <script src="components/pagination2.js"></script>
Vue.component('query-component', {
    template: `
    <div>
         <template id="query-template">
            <el-form :inline="true" class="query-form">
                <el-form-item label="关键字">
                    <el-input clearable @clear="handleQuery" v-model="keyword"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="handleQuery">查询</el-button>
                </el-form-item>
            </el-form>     
        </template>
    </div>
`,
    data() {
        return {
            keyword: ''
        };
    },
    methods: {
        handleQuery() {
            // 进行查询操作
            // 可以在这里发起请求或者触发一个自定义事件，将查询条件传递给父组件
            this.$emit('query', this.keyword);
        }
    }
});
